import { BizKfExtraProColumnType } from '@/components';
import * as API from '@/services';
import { Tooltip } from 'antd';
import { KfPagingTablePage, KfPagingTablePagePropsAction, useBackendEnum } from 'kf-web-library';
import React, { useRef } from 'react';
import { useLocation } from 'umi';

type Entity = API.OpLog;
type EntityPageQueryParams = API.OpLogPageQueryParams;
const entityTypeName = '操作日志';

interface EntityTableListProps {}

/**
 * 操作日志
 */
const EntityTableList: React.FC<EntityTableListProps> = (props) => {
  const location = useLocation();
  const { enumDict, getBackendEnum } = useBackendEnum();
  const actionRef = useRef<KfPagingTablePagePropsAction<Entity, EntityPageQueryParams>>();

  return (
    <KfPagingTablePage<Entity, EntityPageQueryParams, BizKfExtraProColumnType>
      actionRef={actionRef}
      entityTypeName={entityTypeName}
      pagingQuery={(params) => {
        return API.queryOpLogs({ ...params, sort: 'create_time,desc' });
      }}
      opActionsDef={{}}
      opFloatingsDef={{}}
      proTable={{
        tableBarActions: (action, rows) => {
          return [];
        },
        search: false,
      }}
      columns={[
        {
          title: '关键字',
          dataIndex: 'searchText',
          sorter: false,
          hideInTable: true,
          hideInForm: true,
          fieldProps: {
            placeholder: '模糊检索(用户名,操作类型,操作行为)',
          },
        },
        {
          title: '操作时间',
          fixed: 'left',
          dataIndex: nameof<Entity>((x) => x.execStartTime),
          width: 200,
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
        },
        {
          title: '用户名',
          width: 140,
          fixed: 'left',
          dataIndex: nameof<Entity>((x) => x.userNickname),
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
        },
        {
          title: 'IP',
          dataIndex: nameof<Entity>((x) => x.clientIp),
          width: 200,
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
          /*render: (_, record) => {
            return record.user?.groups?.map(g => g.name).join(", ")
          }*/
        },
        {
          title: '类型',
          dataIndex: nameof<Entity>((x) => x.opTag),
          width: 140,
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
        },
        {
          title: '行为',
          dataIndex: nameof<Entity>((x) => x.opSummary),
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
        },
        /*{
          title: '参数',
          dataIndex: nameof<Entity>((x) => x.param),
          width: 120,
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
          /!*render: (_, record) => {
              return <a>查看</a>
          }*!/
        },
        {
          title: '结果',
          dataIndex: nameof<Entity>((x) => x.result),
          align: "center",
          width: 140,
          sorter: false,
          hideInSearch: true,
          ellipsis: true,
          render: (_, record) => {
            if (record.result) {
              const json = JSON.parse(record.result)
              return <>
                <Tooltip title={record.result}>
                  <a style={{color: json.flag ? "#389e0d" : "#ff4d4f"}}>{json.msg}</a>
                </Tooltip>
              </>
            }
            return "-";
          }
        },*/
      ]}
    />
  );
};

export default EntityTableList;
